<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0,maximum-scale=1,minimum-scale=1,user-scalable=no">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <link rel="stylesheet" href="./css/index.css">
    <link rel="stylesheet" href="./lib/font-awesome-4.7.0/css/font-awesome.css">
</head>

<body>
    <!-- 开始 -->
    <div class="details">

        <!-- header 部分 -->
        <header>
            <a href="javascript:;">
                <i class="fa fa-angle-left "></i>
            </a>
            <h3>肯德基优惠卷</h3>
            <a href="javascript:;"></a>
        </header>

        <!-- 提示 -->
        <h5>-点餐之前出示手机中的优惠券,即可享受优惠-</h5>

        <!-- 具体优惠券说明 -->
        <div class="packing">

            <!-- 占个坑 -->

        </div>
        <!-- 遮罩层 -->
        <div class="alertBox">
            <div class="bg"></div>
            <div class="alert">
                    
                    <span class="up-img">
                        <i  class="fa fa-chevron-left"></i>
                    </span>
                    <img class="one"  src="images/2.png" alt="">
                    <span class="next-img">
                        <i class="fa fa-chevron-right"></i>
                    </span>
              
            </div>
        </div>


    </div>

</body>
<!-- 引入jquery -->
<script src="./lib/jquery/jquery-1.12.2.min.js"></script>
<!-- 引入模版工具 -->
<script src="./lib/arttemplate4.0/template-web.js"></script>
<!-- 引入index js -->
<script src="./js/index1.js"></script>

<!-- 模版引擎 -->
<script type="text/template" id="details-tmp">

    {{each data val index}}

    <div class="packing-j">
        <a href="javascript:;" data-index="{{index}}">
          
            <span>
                {{@val.couponProductImg}}
            </span>
            <div class="p-j-r">
                <p>{{val.couponProductName}}</p>
                <p>{{val.couponProductPrice}}</p>
                <p>{{val.couponProductTime}}</p>
            </div>
            <i class="fa fa-chevron-right"></i>
        </a>

    </div>

    {{/each}}
</script>

</html>